<template>
	<view class="weaper">
	  <view class="butomsearch" style="display: none;">
	        <view class="serarchite">
	            <view class="title">产品编号</view>
	            <view class="w22"><input class="inputser" 
	            v-model="goodscode"
	            type="text" placeholder="请输入产品编号"/></view>
	        </view>
	        <view class="serarchite">
	            <view class="title">产品名称</view>
	            <view class=" w22">
	                 <input class="inputser" type="text" v-model="goodsname"
	                  placeholder="请输入产品名称"/>
	            </view>
	        </view>
	        <view class="searchbtn" @click="search">查询</view>
	    </view>
	    <view class="frmand" v-for="item in datalist"  >
	        <view class="itemna">
	          <view class="a1">产品编号：</view>
	          <view class="a2">{{item.ProductCD}}</view>
	        </view>
	        <view class="itemna">
	          <view class="a1">产品名称：</view>
	          <view class="a2">{{item.ProductName}}</view>
	        </view>
			
			<!-- <view class="itemna">
			  <view class="a1">产品批次：</view>
			  <view class="a2">{{item.BatchNO}}</view>
			</view> -->
			
	        <view  class="nniui">
	          <view class="itemna" >
	              <view class="a1">当前库存量(罐)：</view>
	              <view class="a2" >{{item.sn_count}}罐</view>
	          </view>
	        </view>
	        <view class="itemna" v-if="item.is_qianshou == 0" style="color: red;">签收状态：待签收</view>
	        <view class="itemna" v-if="item.is_qianshou == 1" style="color: #1B764A;">签收状态：已签收</view>
	    </view>
	
	    <view class="nodata" v-if="datalist.length == 0">暂无库存明细</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				  page:1,
				  size:10,
				  batch:"",//批次
				  goodscode:"",//产品编号
				  goodsname:"",//产品名称
				  datalist:[]
			}
		},
		onLoad() {
			this.get_data()
		},
		methods: {
			get_data(){
				var that=this
				var postdata={}
				postdata.keywords=this.keywords
				postdata.user_id=uni.getStorageSync("fahuo_username").id
				this.request('/api/duoqudao/jxs_product_kucun_detail_new', postdata,"post").then(data => {
					that.datalist=data.data
				})
				
			}
		}
	}
</script>

<style>
.weaper{
  width: calc(100% - 40px);
  margin: 0 auto;
}
.frmand{
  font-size: 14px;
  margin-top: 20px;
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
}
.shuyuan{
  text-align: center;
  background-color: #009688;
  color: #fff;
  height: 35px;
  line-height: 35px;
  border-radius: 5px;
  margin-top: 20px;
}
.itemna{
  line-height: 27px;
  display: flex;
}
page{
  background-color: #eee;
  padding-bottom: 100px;
}
.serarchite{
  display: flex;
}
.inputser{
  font-size: 14px;
  height: 32px;
  line-height: 32px;
  border: 1px solid #eee;
  border-radius: 5px;
  padding-left: 10px;
}
.serarchite{
  margin: 10px 0px;
}
.title{
  font-size: 14px;
  width: 80px;
  line-height: 34px;
}
.searchbtn{
  height: 32px;
  line-height: 32px;
  background-color: #1B764A;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  width: 40%;
  margin: 0 auto;
  margin-top: 20px;
  font-size: 14px;
}
.w22{
  width: calc(100% - 100px);
}
.w22 input{
  width: 100%;
}
.butomsearch{
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
  margin-top: 10px;
}
.flex{
  display: flex;
}
.nniui{
  border-top: 1px solid #eee;
}
.cappppca{
  width:30px;
  height:30px;
  margin-left: 10px;
  margin-top: 2px;
}
.butomsearch{
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
  margin-top: 10px;
}
.nodata{
  text-align: center;
  margin-top: 100px;
  color: #666;
  font-size: 14px;
}
.a1{
  color: #8e8e8e;
}
</style>
